<style scoped>
  .expand-row{
    margin-bottom: 16px;
  }
  .lyx-table-btn{
    margin-right: 5px;
    margin-bottom: 2px;
  }
  .title-size {
    font-weight: bold;
    font-size: 1rem;
  }
  .red {
    color: #FF0000;
    display: inline-block;
  }
  .ivu-form-item-content {
    position: relative;
    line-height: 32px;
    font-size: 12px;
    display: flex;
  }
</style>
<template>
  <div>
    <Form label-position="right" :label-width="100" style="position: relative;" :model="formDate">
      <Row class="mb20">
        <Col span="17" class="ivu-form-item-label title-size">沈阳市城市低保及低保边缘家庭(住房)情况基础信息表（实物配租申请）</Col>
      </Row>
      <Row class="mb20">
        <Col span="5" class="ivu-form-item-label" style="color:red">*为必填项</Col>
      </Row>
      <Row class="mb20">
        <Col span="5" class="ivu-form-item-label">档案编号：</Col>
        <Col span="5" offset="1" class="ivu-form-item-content">
          <Input v-model="formDate.fileNumber"></Input>
          <span class="red">*</span>
        </Col>
      </Row>
      <Row class="mb20">
        <Col span="5" class="ivu-form-item-label">申请人姓名：</Col>
        <Col span="5" offset="1" class="ivu-form-item-content">
          <Input v-model="formDate.applyPerson"></Input>
          <span class="red">*</span>
        </Col>
      </Row>
      <Row class="mb20">
        <Col span="5" class="ivu-form-item-label">户籍地址：</Col>
        <Col span="2" class="ivu-form-item-content">沈阳市：</Col>
        <Col span="4" class="ivu-form-item-content">
          <Select v-model="select1">
            <Option v-for="item in sectionList" :value="item.id" :key="item.id">{{ item.title }}</Option>
          </Select>
          <span class="red">*</span>
        </Col>
        <Col span="3" class="ivu-form-item-label">区县(市)</Col>
        <Col span="5" class="ivu-form-item-content">
          <Input v-model="formDate.lawAddress"></Input>
          <span class="red">*</span>
        </Col>
      </Row>
      <Row class="mb20">
        <Col span="4" offset="7" class="ivu-form-item-content">
          <Select v-model="select2">
            <Option v-for="item in streetList" :value="item.id" :key="item.id">{{ item.title }}</Option>
          </Select>
          <span class="red">*</span>
        </Col>
        <Col span="3" class="ivu-form-item-label">街镇(乡镇)</Col>
        <Col span="5" class="ivu-form-item-content">
          <Select v-model="select3" @on-change="getValidateRules">
            <Option v-for="item in committeesList" :value="item.company_code" :key="item.id">{{ item.title }}</Option>
          </Select>
          <span class="red">*</span>
        </Col>
        <Col span="1" class="ivu-form-item-label">社区</Col>
      </Row>
      <Row class="mb20">
        <Col span="5" class="ivu-form-item-label">低保(边缘)/特殊供养证号：</Col>
        <Col span="5" offset="1" class="ivu-form-item-content">
          <Input v-model="formDate.cardNumber" ></Input>
          <span class="red">*</span>
        </Col>
        <Col span="9" offset="1"  class="ivu-form-item-content">
          <RadioGroup v-model="formDate.isDb">
            <Radio :label="item.value" v-for="item in dibao" :value="item.value" :key="item.value">{{item.label}}</Radio>
          </RadioGroup>
          <span class="red">*</span>
        </Col>
      </Row>
      <Row class="mb20">
        <Col span="5" class="ivu-form-item-label">身份证编号：</Col>
        <Col span="5" offset="1" class="ivu-form-item-content">
          <Input v-model="formDate.applyIdCard"></Input>
          <span class="red">*</span>
        </Col>
        <Col span="1" class="ivu-form-item-label">18位</Col>
        <Col span="4" class="ivu-form-item-label">再次输入身份证号：</Col>
        <Col span="6" class="ivu-form-item-content">
          <Input v-model="formDate.cardNo"></Input>
        </Col>
      </Row>
      <Row class="mb20">
        <Col span="5" class="ivu-form-item-label">现居住地址：</Col>
        <Col span="2" class="ivu-form-item-label">沈阳市：</Col>
        <Col span="4" class="ivu-form-item-content">
          <Select v-model="select4">
            <Option v-for="item in sectionList" :value="item.id" :key="item.id">{{ item.title }}</Option>
          </Select>
          <span class="red">*</span>
        </Col>
        <Col span="3" class="ivu-form-item-label">区县(市)</Col>
        <Col span="5" class="ivu-form-item-content">
          <Input v-model="formDate.residAddress"></Input>
          <span class="red">*</span>
        </Col>
      </Row>
      <Row class="mb20">
        <Col span="4" offset="7" class="ivu-form-item-content">
          <Select v-model="select5">
            <Option v-for="item in streetList1" :value="item.id" :key="item.id">{{ item.title }}</Option>
          </Select>
          <span class="red">*</span>
        </Col>
        <Col span="3" class="ivu-form-item-label">街镇(乡镇)</Col>
        <Col span="5" class="ivu-form-item-content">
          <Select v-model="select6">
            <Option v-for="item in committeesList1" :value="item.company_code" :key="item.id">{{ item.title }}</Option>
          </Select>
          <span class="red">*</span>
        </Col>
        <Col span="1" class="ivu-form-item-label">社区</Col>
      </Row>
      <Row class="mb20">
        <Col span="5" class="ivu-form-item-label">通讯地址：</Col>
        <Col span="8" offset="1">
          <Input v-model="formDate.address" ></Input>
        </Col>
        <Col span="2" class="ivu-form-item-label">邮编：</Col>
        <Col span="3">
          <Input v-model="formDate.zip"></Input>
        </Col>
      </Row>
      <Row class="mb20">
        <Col span="5" class="ivu-form-item-label">移动电话：</Col>
        <Col span="4" offset="1">
          <Input v-model="formDate.mobilePhone" @on-blur="yanzhengtel"></Input>
        </Col>
        <Col span="3" class="ivu-form-item-label">必须为11位数字</Col>
        <Col span="3" class="ivu-form-item-label">固定电话：</Col>
        <Col span="3">
          <Input v-model="formDate.phone"></Input>
        </Col>
      </Row>
      <Row class="mb20">
        <Col span="5" class="ivu-form-item-label">核查登记日期：</Col>
        <Col span="4" offset="1" class="ivu-form-item-content">
          <DatePicker type="date" v-model="formDate.registDate"></DatePicker>
          <span class="red">*</span>
        </Col>
        <Col span="2" class="ivu-form-item-label">调查员：</Col>
        <Col span="3" class="ivu-form-item-content">
          <Input v-model="formDate.investigators"></Input>
          <span class="red">*</span>
        </Col>
        <Col span="2" class="ivu-form-item-label">审核员：</Col>
        <Col span="3" class="ivu-form-item-content">
          <Input v-model="formDate.auditor"></Input>
          <span class="red">*</span>
        </Col>
      </Row>
      <Row class="mb20">
        <Col span="13" class="ivu-form-item-label">
          <Button @click="save()">提交</Button>
        </Col>
      </Row>
    </Form>
  </div>
</template>
<script>
import { getMailLevelList, getSQCodeFc, date2str } from '@/api/eventlist'

import { ensureApply } from '@/api/houseproperty'
export default {
  name: 'Form17',
  data () {
    return {
      code: '',
      lawSectionCode: '',
      tempArr: [],
      select1: '',
      select2: '',
      select3: '',
      select4: '',
      select5: '',
      select6: '',
      bwk: '0',
      paramsArr: [],
      list: [],
      sectionList: [],
      streetList: [],
      streetList1: [],
      committeesList: [],
      committeesList1: [],
      batchList: [],
      dibao: [{ value: 0, label: '低保' }, { value: 1, label: '边缘' }, { value: 3, label: '特殊供养' }]
    }
  },
  props: {
    formDate: Object,
    aacode: String
  },
  mounted () {
    this.getPermanentAddress()
    if (this.formDate.hjqxCode) {
      this.select1 = this.formDate.hjqxCode
    }
    if (this.formDate.hjjdCode) {
      this.select2 = this.formDate.hjjdCode
    }
    if (this.formDate.hjsqCode) {
      this.select3 = this.formDate.hjsqCode
    }
    if (this.formDate.jzqxCode) {
      this.select4 = this.formDate.jzqxCode
    }
    if (this.formDate.jzjdCode) {
      this.select5 = this.formDate.jzjdCode
    }
    if (this.formDate.jzsqCode) {
      this.select6 = this.formDate.jzsqCode
    }
    if (this.formDate.hjsqCode) {
      this.getValidateRules()
    }
  },
  watch: {
    select1 (val) {
      this.formDate.hjqxCode = val
      let param = { id: val }
      getMailLevelList(param).then(res => {
        if (res.data.errcode === 0) {
          this.streetList = res.data.data
        } else {
          this.$Notice.error({ title: '失败', desc: res.data.errmsg })
        }
      })
    },
    select2 (val) {
      this.formDate.hjjdCode = val
      let param = { id: val }
      getMailLevelList(param).then(res => {
        if (res.data.errcode === 0) {
          this.committeesList = res.data.data
        } else {
          this.$Notice.error({ title: '失败', desc: res.data.errmsg })
        }
      })
    },
    select3 (val) {
      this.formDate.hjsqCode = val
      let q = { company_code: val }
      getSQCodeFc(q).then(res => {
        if (res.data.errcode === 0) {
          this.formDate.lawSectionCode = res.data.data.qu_code
          this.formDate.lawStreetCode = res.data.data.jiedao_code
          this.formDate.lawCommitteesCode = res.data.data.shequ_code
        } else {
          this.$Notice.error({ title: '失败', desc: res.data.errmsg })
        }
      })
    },
    select4 (val) {
      this.formDate.jzqxCode = val
      let param = { id: val }
      getMailLevelList(param).then(res => {
        if (res.data.errcode === 0) {
          this.streetList1 = res.data.data
        } else {
          this.$Notice.error({ title: '失败', desc: res.data.errmsg })
        }
      })
    },
    select5 (val) {
      this.formDate.jzjdCode = val
      let param = { id: val }
      getMailLevelList(param).then(res => {
        if (res.data.errcode === 0) {
          this.committeesList1 = res.data.data
        } else {
          this.$Notice.error({ title: '失败', desc: res.data.errmsg })
        }
      })
    },
    select6 (val) {
      this.formDate.jzsqCode = val
      let q = { company_code: val }
      getSQCodeFc(q).then(res => {
        if (res.data.errcode === 0) {
          this.formDate.resideSectionCode = res.data.data.qu_code
          this.formDate.resideStreetCode = res.data.data.jiedao_code
          this.formDate.resideCommitteesCode = res.data.data.shequ_code
        } else {
          this.$Notice.error({ title: '失败', desc: res.data.errmsg })
        }
      })
    }
  },
  methods: {
    save () {
      console.log('1211')
      this.formDate.registDate = date2str(this.formDate.registDate)
      console.log(this.formDate.registDate, 'riqi')
      if (!this.formDate.lawSectionCode) {
        this.$Notice.error({ title: '请选择市区', desc: '' })
        return false
      }
      if (!this.formDate.lawStreetCode) {
        this.$Notice.error({ title: '请选择街道', desc: '' })
        return false
      }
      if (!this.formDate.lawCommitteesCode) {
        this.$Notice.error({ title: '请选择社区', desc: '' })
        return false
      }
      if (!this.formDate.residAddress) {
        this.$Notice.error({ title: '请填写居住地具体地址', desc: '' })
        return false
      }
      if (!this.formDate.lawAddress) {
        this.$Notice.error({ title: '请填写户籍地具体地址', desc: '' })
        return false
      }
      if (!this.formDate.cardNumber) {
        this.$Notice.error({ title: '请填写低保(边缘)/特殊供养证号', desc: '' })
        return false
      }
      if (this.formDate.isDb === undefined) {
        this.$Notice.error({ title: '请选择低保', desc: '' })
        return false
      }
      if (!this.formDate.resideSectionCode) {
        this.$Notice.error({ title: '请选择市区', desc: '' })
        return false
      }
      if (!this.formDate.resideStreetCode) {
        this.$Notice.error({ title: '请选择街道', desc: '' })
        return false
      }
      if (!this.formDate.resideCommitteesCode) {
        this.$Notice.error({ title: '请选择社区', desc: '' })
        return false
      }
      if (!this.formDate.registDate) {
        this.$Notice.error({ title: '请填写登记日期', desc: '' })
        return false
      }
      if (!this.formDate.investigators) {
        this.$Notice.error({ title: '请填写调查员', desc: '' })
        return false
      }
      if (!this.formDate.auditor) {
        this.$Notice.error({ title: '请填写审核员', desc: '' })
        return false
      }
      console.log(this.ruleData.areaStandard + 'www')
      this.$emit('ee', this.formDate.isDb, this.ruleData.areaStandard)
    },
    // 查询街道社区
    getPermanentAddress () {
      getMailLevelList().then(res => {
        if (res.data.errcode === 0) {
          this.sectionList = res.data.data
          console.log(this.sectionList)
        } else {
          this.$Notice.error({ title: '失败', desc: res.data.errmsg })
        }
      })
    },
    getValidateRules () {
      let q = { company_code: this.select3 }
      getSQCodeFc(q).then(res => {
        if (res.data.errcode === 0) {
          this.code = res.data.data.qu_code
          ensureApply({ interface_code: 'fangchanju-qbxyjk', lawSectionCode: this.code, code: this.aacode }).then(res => {
            if (res.data.errcode === 0) {
              console.log(res.data.data, '规则信息')
              this.ruleData = res.data.data
            } else {
              this.$Notice.error({ title: res.data.errmsg })
            }
          })
        } else {
          this.$Notice.error({ title: '失败', desc: res.data.errmsg })
        }
      })
    },
    yanzhengtel () {
      var reg = /^((13[0-9])|(17[0-1,6-8])|(15[^4,\\D])|(18[0-9]))\d{8}$/
      if (reg.test(this.formDate.mobilePhone) === false) {
        this.$Notice.error({ title: '请输入11位正确的手机号', desc: '' })
        this.formDate.mobilePhone = ''
      }
    }
  }
}
</script>
